
// 1. 封装格式化时间函数，支持 Date 和 string 格式的时间，转换成功 `10:10:10` 时分秒
const formatTime = (date?: Date | string): string => {
    if (!date) date = new Date()
    if (typeof date === 'string') date = new Date(date)
    const h = date.getHours()
    const m = date.getMinutes()
    const s = date.getSeconds()
    return `${h}:${m}:${s}`
}

// 2. 定义访问记录单项 对象 类型，定义访问记录 列表 类型，需要存储在本地的 key 字面量类型
type Data = {
    count: number
    time: string
}
type List = Array<Data>
const KEY = 'ts-demo-data'

// 3. 封装获取访问历史记录函数，返回类型是  记录列表
const getData = () => {
    const str = localStorage.getItem(KEY)
    return JSON.parse(str || "[]") as List
}

// 4.封装修改访问历史记录函数
const updateData = () => {
    const list = getData()
    const lastItem = list[list.length - 1]
    list.push({
        count: lastItem ? lastItem.count + 1 : 1,
        time: formatTime()
    })
    localStorage.setItem(KEY, JSON.stringify(list))
}

const render = () => {
    updateData()
    const data = getData()
    const app = document.querySelector('#app') as HTMLDivElement
    app.innerHTML = data.map((item) => `次数：${item.count},时间：${item.time}`).join("<br/>")
}

render()
